import React, { useEffect } from 'react'
import './App.css';
import { connect } from 'react-redux'
import axios from 'axios'
function App(props) {
  useEffect(() => {
    props.getBannerList()
  }, [])
  return (
    <div className="App">
      <ul>
        {
          props.bannerList && props.bannerList.map((item) => {
            console.log('555', item)
            return <img src= { item.img } alt = { item.alt } />
          })
        }
      </ul>
    </div>
  );
}

export default connect(
  (state) => {
     console.log('444', state)
    return {
      bannerList: state.getIn(['home', 'bannerList'])
    }
}, (dispatch) => {
  return {
    getBannerList () {
      axios.get('http://121.89.205.189/api/banner/list').then(res => {
        console.log(res.data.data)
        dispatch({
          type: 'CHANGE_BANNER_LIST',
          payload: res.data.data
        })
      })
    }
  }
})(App);
